<div class="signin_wrapper">
    <div class="signin_header">
        Login From
    </div>

    <div class="signin_main">
        <form id="signin" class="autoform" method="post" action="">
            <input id="signin-name" type="text" name="signin[name]" maxlength="32" placeholder="Name">

            <input id="signin-password" type="password" name="signin[password]" maxlength="32" placeholder="Password">

            <div>
                <span class="styled_checkbox">
                    <input id="signin-persistent" type="checkbox" value="1" name="signin[persistent]">
                </span>
            
            
                <span class="rememberme">Remember me on this computer</span>
            </div>
            <div class="clear"></div>
            


            <input id="signin-submit" type="submit" value="Login" name="signin[submit]">

            <input type="button" class="reset_btn" value="Cancel"/>

        </form>
    </div>

    <div class="signin_bottom">

    </div>


</div>
<script>
    jQuery('input[placeholder], textarea[placeholder]').placeholder();

    $('.styled_checkbox').bind('click',function(e){
        e.preventDefault();
        var self = $(this);
        if(self.hasClass('styled_checked')){
            self.removeClass('styled_checked');
            self.find('input').prop('checked',false);
        }
        else{
            self.addClass('styled_checked');
            self.find('input').prop('checked',true);
        }
    });

    (function($){
        $('.reset_btn').bind('click',function(e){
            e.preventDefault();
            $(this).parent().find('input[type=text],input[type=password]').val('').trigger('focus').blur();
        });
    })(jQuery);
</script>